<<<<<<< HEAD
// 显示子菜单
function showSubMenu(element) {
    const subMenu = element.querySelector('.sub-menu');
    if (subMenu) {
      subMenu.style.display = 'block';
    }
  }
  
  // 隐藏子菜单
  function hideSubMenu(element) {
    const subMenu = element.querySelector('.sub-menu');
    if (subMenu) {
      subMenu.style.display = 'none';
    }
  }
=======
const API_URL = 'http://localhost:3000/students'; // JSON-Server API URL
const studentTable = document.getElementById('studentTable').querySelector('tbody');
const studentForm = document.getElementById('studentForm');

// 初始化表格数据
function loadStudents() {
    fetch(API_URL)
        .then(response => response.json())
        .then(data => {
            studentTable.innerHTML = ''; // 清空表格
            data.forEach(student => {
                addStudentRow(student);
            });
        })
        .catch(error => console.error('Error fetching students:', error));
}

// 添加学生到表格
function addStudentRow(student) {
    const row = document.createElement('tr');
    row.innerHTML = `
        <td>${student.id}</td>
        <td>${student.name}</td>
        <td>${student.age}</td>
        <td>${student.major}</td>
        <td>${student.grade}</td>
        <td>
            <button onclick="deleteStudent(${student.id})">删除</button>
            <button onclick="editStudent(${student.id})">编辑</button>
        </td>
    `;
    studentTable.appendChild(row);
}

// 删除学生
function deleteStudent(id) {
    fetch(`${API_URL}/${id}`, {
        method: 'DELETE',
    })
        .then(() => loadStudents()) // 重新加载数据
        .catch(error => console.error('Error deleting student:', error));
}

// 新增学生
studentForm.addEventListener('submit', event => {
    event.preventDefault();
    const newStudent = {
        name: document.getElementById('name').value,
        age: parseInt(document.getElementById('age').value),
        major: document.getElementById('major').value,
        grade: document.getElementById('grade').value,
    };

    fetch(API_URL, {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
        },
        body: JSON.stringify(newStudent),
    })
        .then(() => {
            studentForm.reset(); // 清空表单
            loadStudents(); // 重新加载数据
        })
        .catch(error => console.error('Error adding student:', error));
});

// 编辑学生
function editStudent(id) {
    const student = Array.from(studentTable.querySelectorAll('tr')).find(row =>
        row.querySelector('td').textContent == id
    );

    const name = prompt('修改姓名:', student.children[1].textContent);
    const age = prompt('修改年龄:', student.children[2].textContent);
    const major = prompt('修改专业:', student.children[3].textContent);
    const grade = prompt('修改年级:', student.children[4].textContent);

    const updatedStudent = { name, age: parseInt(age), major, grade };

    fetch(`${API_URL}/${id}`, {
        method: 'PUT',
        headers: {
            'Content-Type': 'application/json',
        },
        body: JSON.stringify(updatedStudent),
    })
        .then(() => loadStudents()) // 重新加载数据
        .catch(error => console.error('Error editing student:', error));
}

// 初始化页面
loadStudents();
>>>>>>> e96546b (实验五代码提交)
